<template>
  <div>
    <a-progress :percent="30" />
    <a-progress
      :percent="70"
      status="exception"
    />
    <a-progress
      :percent="100"
      :show-info="false"
    />
    <a-progress
      type="circle"
      :percent="75"
    />
    <a-progress
      type="circle"
      :percent="100"
    />
    <a-progress
      :percent="30"
      size="small"
    />
    <a-progress
      type="circle"
      :percent="30"
      :size="80"
    />
    <br>
    <a-progress
      type="circle"
      trail-color="#e6f4ff"
      :percent="60"
      :stroke-width="29"
      :size="20"
      :format="number => `进行中，已完成${number}%`"
    />这里是响应式进度圈
    <a-tooltip title="3 done / 3 in progress / 4 to do">
      <a-progress
        type=dashboard
        :percent="100"
        :gapDegree="100"
        stroke-linecap="square"
        :stroke-color="{
        '0%': '#108ee9',
        '100%': '#87d068',
      }"
      />

    </a-tooltip>
    <a-progress
      :percent="15"
      :steps="30"
      size="small"
    />
    <a-progress
      :percent="100"
      :steps="5"
      :stroke-color="['red','black','pink','pink','pink']"
    />
  </div>
</template>

<script>
export default {
  name: '',
  components: {},
  data() {
    return {
    }
  },
  created() { },
  mounted() { },
  methods: {},
  computed: {}
}
</script>
<style scoped lang='scss'>
</style>
